
import React from 'react'
import { Outlet, useNavigate } from 'react-router-dom'
  
export default function Home() {
  // console.log(useNavigate());
  //  const useNavigate =useNavigate();
  // useNavigate
  // 返回一个函数用来编程式导航  
  // navigate（目标路径） 可以用跳转得到指定的路径
  const navigate = useNavigate()
  const toMusicHandle = () => {
    navigate('/main/home/music?music=sola&id=001')
  }
  const toNewsHandle = () => {
    navigate('/main/home/news?news=newspaper&id=002')
  }

  return (
    <div>
      <h2>home</h2>
      <button onClick={toMusicHandle}>Music</button>
      <button onClick={toNewsHandle}>News</button>
      <Outlet />
    </div>
  )
}
